<template>
    <div class="table">
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item><i class="el-icon-tickets"></i>查看投票详情</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="container">
            <div >
                <div class="details"> 
                    <label>发起人:<span class="span-right" >{{voteData.userId}}</span></label>
                    <label>参与人数：<span class="span-right">{{voteData.joinNum}}</span></label> 
                    <label>状态：<span v-if="voteData.open == 1">已结束</span><span v-else>投票中</span></label>
                    <label>类型：<span v-if="voteData.type == 1">多选</span><span v-else>单选</span></label>
                </div>
                <div class="details">
                    <label>创建时间：<span class="span-right">{{voteData.startTime}}</span></label>
                    <label>结束时间：<span class="span-right">{{voteData.endTime}}</span></label> 
                </div>
                <div class="details">标题：{{voteData.title}}</div>
                <div class="details">描述说明：{{voteData.intro}}</div>
            </div>
            <el-table :data="voteData.reqVoteItems" border style="width: 100%"  ref="multipleTable">
                <el-table-column prop="item" label="选项"  align="center">
                </el-table-column>
                <el-table-column prop="joinNum" label="人数（占比）" align="center">
                </el-table-column>
            </el-table>
        </div>
    </div>
</template>

<script>
import { Message } from 'element-ui';
import axios from 'axios';
import { getVoteDetails } from '../../components/api/vote.js';
    export default {
        name: 'voteDeatils',
        data() {
            return {
                userId:JSON.parse(localStorage.getItem('sysUser')),
                voteData:[]
            }
        },   
        created(){
            
            this.getVoteDetailsData();
        },
        methods: {

            //获取中奖详情和抽奖收货地址信息
             getVoteDetailsData(){
                 let that = this;
                 let params = {
                   topicId:this.$route.params.id
                 };
                 console.log(params);
                 getVoteDetails(params).then((res)=>{
                   if(res.status == 200){
                      this.voteData = res.data;
                   }
                   console.log(res);
                 }).catch((err)=>{
                   console.log(err);
                 });
                
               
             }
        }
    }

</script>

<style scoped>
   .details{
       height:50px;
       line-height: 50px;
   }
   .details>label{
       margin-right:70px;
   }
   .details .span-right{
       margin-right:20px;
   }
   .el-form-item--mini.el-form-item, .el-form-item--small.el-form-item{
       margin-bottom:0px;
   }
</style>
